<template>
	<view>
		<!--header-->
		<tui-navigation-bar splitLine @init="initNavigation" @change="opacityChange" :scrollTop="scrollTop" title="我的"
			backgroundColor="#f95615" color="#fff">
			<view class="tui-header-box" :style="{marginTop:top+'px'}">

				<!-- #ifndef MP -->
				<!-- <view class="tui-header-icon">
					<view class="tui-icon-box tui-icon-message" @tap="href(8)">
						<tui-icon name="message" color="#fff" :size="26"></tui-icon>
						<view class="tui-badge tui-badge-red">0</view>
					</view>
					<view class="tui-icon-box tui-icon-setup" @tap="href(2)">
						<tui-icon name="setup" color="#fff" :size="26"></tui-icon>
					</view>
				</view> -->
				<!-- #endif -->
			</view>

		</tui-navigation-bar>
		<!--header-->
		<view class="tui-mybg-box">
			<view class="tui-header-boxs">
				<view class="tui-header-center">
					<image v-if="userinfo.user_headimg" :src="userinfo.user_headimg" class="tui-avatar" @tap="href(3)">
					</image>
					<image v-else src="/static/images/mall/my/mine_def_touxiang_3x.png" class="tui-avatar"
						@tap="href(3)">
					</image>
					<view class="tui-info">
						<view class="tui-nickname" v-if="userinfo.member_info">{{userinfo.nick_name}}
							<view class="yui-store-level">
								<image src="/static/images/my/start.png" mode="widthFix" class="yui-store-level-icon">
								</image>
								<view class="yui-store-level-text" v-if="userinfo.member_info">
									{{userinfo.member_info.name}}
								</view>
							</view>
						</view>
						<view class="tui-explain">分享码：{{userinfo.codes}}</view>
					</view>
				</view>
				<view class="yui-header-setting">
					<view class="tui-header-icon">

						<view class="tui-icon-box tui-icon-message" @click="setting()">
							<image src="/static/images/my/seting.png" mode="widthFix" class="tui-icon-message-img">
							</image>
						</view>
						<view class="tui-icon-box tui-icon-messages" @tap="href(8)">
							<image src="/static/images/my/ding.png" mode="widthFix" class="tui-icon-message-img">
							</image>
							<view class="tui-badge tui-badge-red">0</view>
						</view>
					</view>
				</view>
			</view>

			<view class="yui-box-block">
				<view class="yui-box-block-span" @tap="href(20)">
					<view class="yui-box-block-span-number">
						{{account.balance}}
					</view>
					<view class="yui-box-block-span-text">
						余额
					</view>
				</view>
				<view class="yui-lines"></view>
				<view class="yui-box-block-span" @tap="href(21)">
					<view class="yui-box-block-span-number">
						{{account.lock_balance}}
					</view>
					<view class="yui-box-block-span-text">
						冻结收益
					</view>
				</view>
				<view class="yui-lines"></view>
				<view class="yui-box-block-span" @tap="href(19)">
					<view class="yui-box-block-span-number">
						{{account.point}}
					</view>
					<view class="yui-box-block-span-text">
						积分
					</view>
				</view>
			</view>


		</view>

		<view class="tui-content-box">
			<view class="tui-box tui-order-box tui-tool-box">

				<view class="tui-cell-header">
					<view class="tui-cell-title">我的订单</view>

				</view>

				<view class="tui-order-list">
					<view class="tui-order-item" @tap="href(32)">
						<view class="tui-icon-box">
							<image src="/static/images/my/daifk.png" class="tui-order-icon"></image>
							<view class="tui-badge tui-badge-red" v-if="orderNumbers.for_the_payment">
								{{orderNumbers.for_the_payment}}
							</view>
						</view>
						<view class="tui-order-text">待付款</view>
					</view>
					<view class="tui-order-item" @tap="href(33)">
						<view class="tui-icon-box">
							<image src="/static/images/my/daish.png" class="tui-order-icon"></image>
							<view class="tui-badge tui-badge-red" v-if="orderNumbers.to_send_the_goods">
								{{orderNumbers.to_send_the_goods}}
							</view>
						</view>
						<view class="tui-order-text">待发货</view>
					</view>
					<view class="tui-order-item" @tap="href(34)">
						<view class="tui-icon-box">
							<image src="/static/images/my/daipj.png" class="tui-order-icon"></image>
							<view class="tui-badge tui-badge-red" v-if="orderNumbers.has_been_dsh">
								{{orderNumbers.for_the_goods}}
							</view>
						</view>
						<view class="tui-order-text">待收货</view>
					</view>
					<view class="tui-order-item" @tap="href(35)">
						<view class="tui-icon-box">
							<image src="/static/images/my/allorder.png" class="tui-order-icon"></image>
							<view class="tui-badge tui-badge-red" v-if="orderNumbers.to_send_the_goods">
								{{orderNumbers.to_send_the_goods}}
							</view>
						</view>
						<view class="tui-order-text">退款/售后</view>
					</view>
				</view>
			</view>



			<!--为你推荐-->


		</view>
		<view class="banners">
			<image :src="banner.adv_image" class="tui-slide-image" mode="widthFix" />
		</view>
		<view class="tui-content-box">
			<view class="tui-box tui-tool-box">

				<view class="tui-cell-header">
					<view class="tui-cell-title">服务中心</view>
				</view>

				<view class="tui-order-list tui-flex-wrap">
					<!--  <view class="tui-tool-item" @tap="href(11)">
			        	<view class="tui-icon-box">
			        		<image src="/static/images/my/hexiao.png" class="tui-tool-icon"></image>
			        	</view>
			        	<view class="tui-tool-text">线下核销</view>
			        </view> -->



					<view class="tui-tool-item" @tap="href(14)">
						<view class="tui-icon-box">
							<image src="/static/images/my/location.png" class="tui-tool-icon"></image>
						</view>
						<view class="tui-tool-text">我的地址</view>
					</view>
					<view class="tui-tool-item" @tap="href(5)">
						<view class="tui-icon-box">
							<image src="/static/images/my/share.png" class="tui-tool-icon"></image>
						</view>
						<view class="tui-tool-text">邀请码</view>
					</view>
					<view class="tui-tool-item" @tap="href(7)">
						<view class="tui-icon-box">
							<image src="/static/images/my/team.png" class="tui-tool-icon"></image>
						</view>
						<view class="tui-tool-text">我的团队</view>
					</view>
					<view class="tui-tool-item" @tap="href(17)">
						<view class="tui-icon-box">
							<image src="/static/images/my/kefu.png" class="tui-tool-icon"></image>
						</view>
						<view class="tui-tool-text">在线客服</view>
					</view>

					<view class="tui-tool-item" @tap="href(18)">
						<view class="tui-icon-box">
							<image src="/static/images/my/question.png" class="tui-tool-icon"></image>
						</view>
						<view class="tui-tool-text">信息通知</view>
					</view>
					<view class="tui-tool-item" @tap="href(2)">
						<view class="tui-icon-box">
							<image src="/static/images/my/setting.png" class="tui-tool-icon"></image>
						</view>
						<view class="tui-tool-text">设置绑定</view>
					</view>
					<view class="tui-tool-item" @tap="href(16)">
						<view class="tui-icon-box">
							<image src="/static/images/my/shop.png" class="tui-tool-icon"></image>
						</view>
						<view class="tui-tool-text">我的收藏</view>
					</view>
					<view class="tui-tool-item" @tap="href(13)">
						<view class="tui-icon-box">
							<image src="/static/images/my/down.png" class="tui-tool-icon"></image>
						</view>
						<view class="tui-tool-text">APP下载</view>
					</view>
				</view>
			</view>
		</view>
		<view class="yui-footer">
			<view class="yui-footer-copyright">
				邑予网络提供技术支持
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		onLoad: function(options) {
			let obj = {};
			// #ifdef MP-WEIXIN
			obj = wx.getMenuButtonBoundingClientRect();
			// #endif
			// #ifdef MP-BAIDU
			obj = swan.getMenuButtonBoundingClientRect();
			// #endif
			// #ifdef MP-ALIPAY
			my.hideAddToDesktopMenu();
			// #endif

			uni.getSystemInfo({
				success: (res) => {
					this.width = obj.left || res.windowWidth;
					this.height = obj.top ? (obj.top + obj.height + 8) : (res.statusBarHeight + 44);
					this.top = obj.top ? (obj.top + (obj.height - 32) / 2) : (res.statusBarHeight + 6);
					this.scrollH = res.windowWidth * 0.6
				}
			})
		},
		onShow() {
			// #ifndef MP-WEIXIN
			this.tui.haslogin();
			if (this.tui.isLogin()) {
				this.init();
			}
			// #endif
			// #ifdef MP-WEIXIN
			if (this.tui.getToken()) {
				this.init();
			}
			//#endif



		},
		data() {
			return {
				webURL: "",
				top: 0, //标题图标距离顶部距离
				opacity: 0,
				scrollTop: 0.5,
				gxz: 0,
				productList: [],
				pageIndex: 1,
				loadding: false,
				pullUpOn: true,
				shopid: 0,
				userinfo: {
					'user_tel': '请登录',
					'referee': '请登录',
					'user_headimg': '/static/images/mall/my/mine_def_touxiang_3x.png',
				},
				account: '',
				orderNumbers: '',
				cate: '',
				code: '',
				referee_id: '',
				banner: [],
				jointrader: false,
			}
		},
		methods: {
			href(page) {
				let url = "";
				switch (page) {
					case 2:
						url = "/pageschild/set/set"
						break;
					case 3:
						url = "/pageschild/userInfo/userInfo"
						break;
					case 4:
						url = "/pageschild/myOrder/myOrder"
						break;
					case 5:
						url = "/pageschild/user/inviteCode"
						break;
					case 6:
						url = "/pageschild/user/inviteCodes"
						break;
					case 7:
						url = "/pageschild/user/team"
						break;
					case 8:
						url = "/pages/my/message"
						break;
					case 9:
						url = "/pageschild/user/team"
						break;
					case 10:
						url = "/pageschild/user/exchangeList"
						break;
					case 11:
						url = "/pageschild/user/hexiao"
						break;
					case 12:
						url = "/pageschild/set/set"
						break;
					case 13:
						url = "/pageschild/app/down"
						break;
					case 14:
						url = "/pageschild/address/address"
						break;
					case 16:
						url = "/pages/my/collect"
						break;
					case 17:
						url = "/pages/service-new/service-new"
						break;
					case 18:
						url = "/pages/my/message"
						break;
					case 19:
						url = "/pageschild/user/gxzList"
						break;
					case 20:
						url = "/pageschild/user/balanceList"
						break;
					case 21:
						url = "/pageschild/user/coinList"
						break;
					case 26:
						url = "/pageschild/user/waterList"
						break;
					case 27:
						url = "../franchisee/index"
						break;
					case 28:
						url = "/pageschild/myOrder/myTuanOrder?currentTab=1"
						break;
					case 29:
						url = "/pageschild/myOrder/myTuanOrder?currentTab=2"
						break;
					case 30:
						url = "/pageschild/myOrder/myTuanOrder?currentTab=3"
						break;
					case 31:
						url = "/pageschild/myOrder/myTuanOrder?currentTab=4"
						break;
					case 32:
						url = "/pageschild/myOrder/myOrder?currentTab=1"
						break;
					case 33:
						url = "/pageschild/myOrder/myOrder?currentTab=2"
						break;
					case 34:
						url = "/pageschild/myOrder/myOrder?currentTab=3"
						break;
					case 35:
						url = "/pageschild/myOrder/myOrder?currentTab=4"
						break;
					case 36:
						url = "/pageschild/user/operation"
						break;
					case 37:
						url = "/pages/franchisee/apply"
						break;
					case 38:
						url = "/pageschild/user/feedback"
						break;
					case 39:
						url = "/pageschild/user/gytwList"
						break;
					case 40:
						url = "/pageschild/user/fhbList"
						break;
					default:
						break;
				}

				if (url) {
					// #ifdef MP-WEIXIN
					if (page == 10) {
						this.tui.toast("请在公众号板块使用~");
						return;
					}
					// #endif

					uni.navigateTo({
						url: url
					})
				} else {
					this.tui.toast("功能尚未完善~")
				}
			},
			setting() {
				let url = "/pageschild/set/set"
				uni.navigateTo({
					url: url
				})
			},
			init() {
				let token = this.tui.getToken();
				let datas = {
					token: token,
				};
				let result = this.tui.request('user', 'post', datas, 1000, 1, '', 'userInfo');
				Promise.resolve(result).then((value) => {
					if (value.code == 200) {
						this.userinfo = value.data;
						this.tui.setUserInfoData(value.data);
						//写入缓存
					} else {
						this.tui.toast(value.message);
					}
				})
				let account = this.tui.request('user', 'post', datas, 1000, 1, '', 'userAccount');
				Promise.resolve(account).then((value) => {
					if (value.code == 200) {
						this.account = value.data;
					} else {
						this.tui.toast(value.message);
					}
				})

				//订单数据
				let orderNumbers = this.tui.request('order', 'post', datas, 1000, 1, '', 'orderAngle');
				Promise.resolve(orderNumbers).then((value) => {
					if (value.code == 200) {
						this.orderNumbers = value.data;
					} else {
						this.tui.toast(value.message);
					}
				})

				let datass = {
					token: token,
					id: 3
				};
				//banner
				let banner = this.tui.request('goods', 'post', datass, 1000, 1, '', 'banner');
				Promise.resolve(banner).then((value) => {
					if (value.code == 200) {
						this.banner = value.data.adv_list[0];
					}
				})
				let shopid = this.tui.request('shop', 'post', {
					token: token
				}, 1000, 1, '', 'getShopId');
				Promise.resolve(shopid).then((value) => {
					if (value.code == 200) {
						this.shopid = value.data;

					}
				})

				
			},
			inits() {
				//获取版块信息
				let token = this.tui.getToken();
				let datas = {
					token: token,
				};
				let cate = this.tui.request('goods', 'post', datas, 1000, 1, '', 'userCategory');
				Promise.resolve(cate).then((value) => {
					if (value.code == 10000) {
						this.cate = value.data;
					} else {
						this.tui.toast(value.message);
					}
				})
			},
			detail: function() {
				uni.navigateTo({
					url: '../productDetail/productDetail'
				})
			},
			shopUrl() {
				if (this.shopid > 0) {
					uni.navigateTo({
						url: '/pageschild/shop/index'
					})
				} else {
					uni.navigateTo({
						url: '/pages/franchisee/apply'
					})
				}

			},
			initNavigation(e) {
				this.opacity = e.opacity;
				this.top = e.top;
			},
			opacityChange(e) {
				this.opacity = e.opacity;
			},
			back() {
				uni.navigateBack();
			},
			categorys: function(e) {
				uni.navigateTo({
					url: '../productList/productList?category_id=' + e
				});
			},
		},
		onPageScroll(e) {
			this.scrollTop = e.scrollTop;
		},
		onPullDownRefresh() {
			setTimeout(() => {
				uni.stopPullDownRefresh()
			}, 200)
		},

		onReachBottom: function() {
			if (!this.pullUpOn) return;
			this.loadding = true;
			if (this.pageIndex == 4) {
				this.loadding = false;
				this.pullUpOn = false
			} else {
				let loadData = JSON.parse(JSON.stringify(this.productList));
				loadData = loadData.splice(0, 10)
				if (this.pageIndex == 1) {
					loadData = loadData.reverse();
				}
				this.productList = this.productList.concat(loadData);
				this.pageIndex = this.pageIndex + 1;
				this.loadding = false
			}
		}
	}
</script>

<style>
	.tui-header-box {
		width: 100%;
		padding: 0 30rpx 0 20rpx;
		box-sizing: border-box;
		position: fixed;
		top: 0;
		left: 0;
		display: flex;
		align-items: center;
		justify-content: flex-end;
		height: 32px;
		transform: translateZ(0);
		z-index: 9999;
	}

	.yui-lines {
		background: rgba(255, 255, 255, 0.4);
		width: 2rpx;
		height: 50rpx;
		margin-top: 20rpx;
	}

	.yui-store-level {
		border-radius: 20rpx;
		background: #ed6248;
		color: white;
		text-align: center;

		display: flex;
		justify-content: space-around;
		font-size: 24rpx;
		padding: 2rpx 16rpx;
		margin-left: 10rpx;
	}

	.yui-store-level-text {
		margin-top: 4rpx;
		text-align: center;
	}

	.yui-store-level-icon {
		width: 36rpx;
		height: 36rpx;
		margin-right: 6rpx;
	}

	.yui-header-block {
		background: #fff;
		margin: 0 30rpx 0rpx 30rpx;
		border-radius: 10rpx;
		margin-top: 10rpx;
		padding-bottom: 30rpx;
		/* height: 320rpx; */
		color: #000;
		box-shadow: 0 3rpx 20rpx rgba(183, 183, 183, 0.1);
		position: relative;

	}

	.yui-footer {
		position: fixed;
		bottom: 120rpx;
		font-size: 24rpx;
		width: 100%;
		color: #cbcfd0;
		left: 0;
	}

	.yui-footer-copyright {
		text-align: center;
	}

	.tui-activity-img {
		width: 100%;
		border-radius: 10rpx;
		display: block;
	}

	.yui-box-block {
		display: flex;
		justify-content: space-around;
		color: #fff;
		text-align: center;
		margin: 0 40rpx;
		margin-top: 36rpx;
	}

	.yui-box-block-span {}

	.yui-box-block-span-number {
		text-align: center;
		font-weight: bold;
		font-size: 34rpx;
		margin-bottom: 10rpx;
	}

	.yui-box-block-span-text {
		font-size: 24rpx;
		color: #f7f7f7
	}

	.banners {
		width: 100%;

		/* margin-top: 40rpx; */
		display: block;
		text-align: center;
		margin: 0 auto;
		margin-top: -60rpx;
		margin-bottom: 80rpx;

	}

	.tui-header-icon {
		min-width: 100rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}


	/* #ifdef MP */
	.tui-set-box {
		min-width: 100rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}


	/* #endif */
	.tui-tool-box {
		margin-top: 20rpx;
	}

	.tui-icon-box {
		position: relative;
	}

	.tui-activity-box {
		margin-top: 20rpx;
	}

	.tui-icon-message {
		width: 42rpx;
		height: 42rpx;
	}

	.tui-icon-messages {
		width: 40rpx;
		height: 40rpx;
	}

	.tui-icon-message-img {
		width: 36rpx;
		height: 36rpx
	}

	.level_icon {
		font-size: 20rpx;
		color: #724f0c;
		padding: 2rpx 8rpx;
		border-radius: 20rpx;
		margin-left: 10rpx;
		background-image: linear-gradient(to bottom left, #fed204, #fefae7);
	}

	.tui-icon-setup {
		margin-left: 8rpx;
	}

	.tui-badge {
		position: absolute;
		font-size: 24rpx;
		height: 32rpx;
		min-width: 20rpx;
		padding: 0 6rpx;
		border-radius: 40rpx;
		right: 4rpx;
		top: -10rpx;
		transform: scale(0.8) translateX(60%);
		transform-origin: center center;
		display: flex;
		align-items: center;
		justify-content: center;
		z-index: 10;
	}

	.tui-badge-red {
		background: #ff6e0e;
		color: #fff;
	}

	.tui-badge-white {
		background: #fff;
		color: #F74D54;
	}

	.tui-badge-dot {
		position: absolute;
		height: 12rpx;
		width: 12rpx;
		border-radius: 50%;
		right: -12rpx;
		top: 0;
		background: #F74D54;
	}

	.yui-img-lm {
		width: 40rpx;

	}

	
	/* #ifdef MP-WEIXIN */
	/* .tui-mybg-box {
		width: 100%;
		height: 480rpx;
		position: relative;
		padding: 0 30rpx 0 20rpx;
		background-image: linear-gradient(to bottom right, #ff3e2b, #ff6948);
		position: relative;
	}

	.tui-header-boxs {
		width: 100%;
		padding: 0 30rpx 0 10rpx;
		box-sizing: border-box;
		z-index: 9999;
		padding-top: 110rpx;
	}

	.yui-header-setting {
		position: absolute;
		right: 80rpx;
		z-index: 10000;
		top: 180rpx;
	} */

	/* #endif */
	/* #ifndef MP-WEIXIN */
	/* .tui-mybg-box {
		width: 100%;
		height: 420rpx;
		position: relative;
		background-image: linear-gradient(to bottom right, #ff3e2b, #ff6948);
		position: relative;
	}

	.tui-header-boxs {
		width: 100%;
		padding: 0 30rpx 0 20rpx;
		box-sizing: border-box;
		z-index: 9999;
		padding-top: 70rpx;
	}

	.yui-header-setting {
		position: absolute;
		right: 30rpx;
		z-index: 10000;
		top: 120rpx;
	} */

	/* #endif */
     /* #ifdef APP */
     
	 .tui-mybg-box {
	 	width: 100%;
	 	height: 400rpx;
	 	position: relative;
	 	background-image: linear-gradient(to bottom right, #ff3e2b, #ff6948);
	 	position: relative;
	 }
	 .tui-header-boxs{
	 	position: relative;
	 	width: 100%;
	 	padding: 20rpx 30rpx 0 20rpx;
	 	box-sizing: border-box;
	 	z-index: 9999;
	 	padding-top: 90rpx;
	 }
	 .yui-header-setting{
	 	position: absolute;
	 	right:30rpx;
	 	z-index: 10000;
	 	top:120rpx;
	 }
     /* #endif */
	 /* #ifndef APP */
	 .tui-mybg-box {
	 	width: 100%;
	 	height: 400rpx;
	 	position: relative;
	 	background-image: linear-gradient(to bottom right, #ff3e2b, #ff6948);
	 	position: relative;
	 }
	 .tui-header-boxs{
	 	position: relative;
	 	width: 100%;
	 	padding: 0 30rpx 0 20rpx;
	 	box-sizing: border-box;
	 	z-index: 9999;
	 	padding-top: 70rpx;
	 }
	 .yui-header-setting{
	 	position: absolute;
	 	right:30rpx;
	 	z-index: 10000;
	 	top:120rpx;
	 }
	 /* #endif */
	

	.tui-my-bg {
		width: 100%;
		height: 344rpx !important;
		display: block;
	}

	.tui-header-center {
		width: 100%;
		/* left: 14rpx; */

		color: #fff;
		padding: 0 30rpx;
		box-sizing: border-box;
		display: flex;
		align-items: center;
	}

	.tui-avatar {
		flex-shrink: 0;
		width: 100rpx;
		height: 100rpx;
		border-radius: 50%;
		display: block;
	}

	.tui-info {
		width: 60%;
		padding-left: 20rpx;
		margin-top: 0rpx;

	}

	.tui-nickname {
		font-size: 28rpx;
		font-weight: bold;
		/* color: #fff; */
		display: flex;
		align-items: center;
	}

	.tui-img-vip {
		width: 56rpx;
		height: 24rpx;
		margin-left: 18rpx;
	}

	.tui-explain {
		width: 80%;
		font-size: 24rpx;
		font-weight: 400;
		/* color: #fff; */
		opacity: 0.75;
		padding-top: 8rpx;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.tui-btn-edit {
		flex-shrink: 0;
		padding-right: 22rpx;
	}

	.tui-header-btm {
		width: 100%;
		padding: 20rpx 0rpx;
		box-sizing: border-box;
		display: flex;
		align-items: center;
		justify-content: space-between;
		/* color: #fff; */
	}

	.tui-btm-item {
		flex: 1;
		color: #000;
		display: flex;
		text-align: center;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.tui-btm-num {
		font-size: 34rpx;
		font-weight: 600;
		margin-top: 10rpx;
		margin-bottom: 10rpx;
		position: relative;
	}

	.tui-btm-text {
		font-size: 24rpx;
		color: #2c2c2c;
		text-align: center;
		display: flex;
		justify-content: space-between;
		padding-top: 4rpx;
	}

	.tui-btm-text-icon {
		width: 60rpx
	}

	.tui-btm-text-span {
		font-weight: 500;
		font-size: 26rpx;
	}

	.tui-content-box {
		width: 100%;
		padding: 0 30rpx;
		box-sizing: border-box;
		position: relative;
		border-radius: 20rpx;
		top: -72rpx;
		z-index: 10;
	}

	.tui-box {
		width: 100%;
		background: #fff;
		box-shadow: 0 3rpx 20rpx rgba(183, 183, 183, 0.1);
		border-radius: 20rpx;
		/* overflow: hidden; */
	}

	.tui-order-box {
		height: 208rpx;
	}

	.tui-cell-header {
		width: 100%;
		height: 74rpx;
		padding: 0 26rpx;
		box-sizing: border-box;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.tui-cell-title {
		font-size: 30rpx;
		line-height: 30rpx;
		padding-top: 20rpx;
		padding-left: 10rpx;
		font-weight: 600;
		color: #333;
	}

	.tui-cell-sub {
		font-size: 26rpx;
		font-weight: 400;
		color: #999;
		padding-right: 28rpx;
	}

	.tui-order-list {
		width: 100%;
		height: 134rpx;
		/* padding: 0 30rpx; */
		box-sizing: border-box;
		display: flex;
		align-items: center;
		justify-content: space-between;

	}

	.tui-order-item {
		flex: 1;
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.tui-order-text,
	.tui-tool-text {
		font-size: 26rpx;
		font-weight: 400;
		color: #666;
		padding-top: 8rpx;
	}

	.tui-tool-text {
		font-size: 24rpx;
	}

	.tui-order-icon {
		width: 54rpx;
		height: 54rpx;
		display: block;
	}

	.tui-assets-img-box {

		margin-top: 20rpx;
	}

	.tui-assets-box {
		height: 178rpx;
		margin-top: 20rpx;
	}

	.tui-assets-list {
		height: 84rpx;
	}

	.tui-assets-num {
		font-size: 32rpx;
		font-weight: 500;
		color: #333;
		position: relative;
	}

	.tui-assets-text {
		font-size: 24rpx;
		font-weight: 400;
		color: #666;
		padding-top: 6rpx;
	}

	.tui-tool-box {
		margin-top: 20rpx;
	}

	.tui-flex-wrap {
		flex-wrap: wrap;
		height: auto;
		padding-bottom: 30rpx;
	}

	.tui-tool-item {
		width: 25%;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		padding-top: 30rpx;
	}

	.tui-tool-icon {
		width: 60rpx;
		height: 60rpx;
		display: block;
	}

	.tui-badge-icon {
		width: 66rpx;
		height: 30rpx;
		position: absolute;
		right: 0;
		transform: translateX(88%);
		top: -15rpx;
	}

	/*为你推荐*/
	.tui-product-list {
		display: flex;
		justify-content: space-between;
		flex-direction: row;
		flex-wrap: wrap;
		box-sizing: border-box;
	}

	.tui-product-container {
		flex: 1;
		margin-right: 2%;
	}

	.tui-product-container:last-child {
		margin-right: 0;
	}

	.tui-pro-item {
		width: 100%;
		margin-bottom: 4%;
		background: #fff;
		box-sizing: border-box;
		border-radius: 12rpx;
		overflow: hidden;
	}

	.tui-pro-img {
		width: 100%;
		display: block;
	}

	.tui-pro-content {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		box-sizing: border-box;
		padding: 20rpx;
	}

	.tui-pro-tit {
		color: #2e2e2e;
		font-size: 26rpx;
		word-break: break-all;
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
	}

	.tui-pro-price {
		padding-top: 18rpx;
	}

	.tui-sale-price {
		font-size: 34rpx;
		font-weight: 500;
		color: #e41f19;
	}

	.tui-factory-price {
		font-size: 24rpx;
		color: #a0a0a0;
		text-decoration: line-through;
		padding-left: 12rpx;
	}

	.tui-pro-pay {
		padding-top: 10rpx;
		font-size: 24rpx;
		color: #656565;
	}

	.tui-btn-back {
		width: 88rpx;
		height: 88rpx;
		font-size: 26rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 50%;
		background-color: rgba(0, 0, 0, .5);
		color: #fff;
		position: fixed;
		bottom: 60rpx;
		right: 30rpx;
		z-index: 9999;
	}
</style>